﻿@model MvcDemo.Models.Geetest.LoginInfo
@{
    ViewBag.Title = "Geetest";
    <script src="~/Scripts/jquery-1.10.2.min.js"></script>
    <script src="http://static.geetest.com/static/tools/gt.js"></script>
}

<form class="form-signin" action="@Url.Action("Geetest", "Geetest")" method="post">
    <h2 class="form-signin-heading">Please sign in</h2>
    @if (ViewData["message"] != null)
    {
        <div class="alert alert-danger alert-dismissible" role="alert">
            <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            @ViewData["message"].ToString()
        </div>
    }
    <label>用户名</label>
    @Html.TextBoxFor(n => n.UserName, new { placeholder = "用户名", @class = "form-control", autofocus = "" })
    @Html.ValidationMessageFor(n => n.UserName)
    <br />
    <label>密码</label>
    @Html.PasswordFor(n => n.Password, new { placeholder = "密码", @class = "form-control" })
    @Html.ValidationMessageFor(n => n.Password)
    <br />
    <label for="captcha">验证码</label>
    <div id="captcha"></div>
    <br />
    <button type="submit" class="btn btn-lg btn-primary">提交</button>
</form>


<script>
    $.ajax({
        // 获取id，challenge，success（是否启用failback）
        url: '@Url.Action("GetCaptcha", "Geetest")',
        type: "get",
        dataType: "json", // 使用jsonp格式
        success: function (data) {
            // 使用initGeetest接口
            // 参数1：配置参数，与创建Geetest实例时接受的参数一致
            // 参数2：回调，回调的第一个参数验证码对象，之后可以使用它做appendTo之类的事件
            window.initGeetest({
                gt: data.gt,
                challenge: data.challenge,
                //product: "embed", // 产品形式
                offline: !data.success
            }, function (captchaObj) {
                // 将验证码加到id为captcha的元素里
                captchaObj.appendTo("#captcha");
            });
        }
    });
</script>
